<template>
  <a-modal
    title="选择类型"
    :width="520"
    :visible="visible"
    :confirmLoading="confirmLoading"
    :maskClosable="false"
    :destroyOnClose="true"
    @ok="handleSubmit"
    @cancel="handleCancel"
  >

    <a-spin :spinning="confirmLoading">
      <a-radio-group v-model:value="type" button-style="solid">
        <a-radio-button v-for="(item, index) in BookActionType.getData()"
                        :key='index'
                        :disabled='item.value !== BookActionType.IMAGE_NODE.value'
                        :value="item.value">{{item.name}}</a-radio-button>
      </a-radio-group>


    </a-spin>
  </a-modal>
</template>

<script>
/** @var {BookActionType} BookActionType */
import BookActionType from '@/common/enum/bookActionType'

export default {
  name: 'addPageForm',
  data(){
    return {
      BookActionType,
      type:BookActionType.IMAGE_NODE.value,
      // 标签布局属性
      labelCol: { span: 7 },
      // 输入框布局属性
      wrapperCol: {
        span: 13
      },
      // 正在加载
      isLoading: false,
      bookId:'',
      // modal(对话框)是否可见
      visible: false,
      // modal(对话框)确定按钮 loading
      confirmLoading: false,
      bookName:'',
    }
  },
  methods:{
    open (bookId,bookName) {
      // 显示窗口
      this.visible = true
      this.bookId = bookId
      this.bookName = bookName
    },
    /**
     * 确认按钮
     */
    handleSubmit (e) {
      e.preventDefault()
      // 表单验证
      this.$router.push({path:'/book/page/edit',query:{bookId:this.bookId,type:this.type,bookName:this.bookName}})
    },

    /**
     * 关闭对话框事件
     */
    handleCancel () {
      this.visible = false
    },
  }
}
</script>

<style scoped>

</style>